import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import "../component" as C
Item {

    FontLoader {
        id: iconFont
        source: "qrc:/assets/fontawesome-free-6.7.2-desktop/otfs/Font Awesome 6 Free-Solid-900.otf"
    }

    Rectangle {
        anchors.fill: parent
        color: "transparent"
    }
    Loader {
        id: serialPage
        source: "qrc:/pages/SerialPage.qml"
    }
        ColumnLayout {
            id: rootAbout
            anchors.fill: parent
            anchors.margins: 20
            anchors.leftMargin: 60
            spacing: 15
            property int cardWidth: 170
        Card {
            id: machineIdCard
            padding: 30
            cardColor: "#FFFFFF"
            shadowEnabled: false
            Layout.preferredWidth: 1580
            Layout.preferredHeight: rootAbout.cardWidth
            Layout.alignment: Qt.AlignHCenter

            Row {
                Layout.fillWidth: true
                spacing: 30
                Layout.alignment: Qt.AlignVCenter

                Image {
                    width: 70
                    height: 70
                    Layout.alignment: Qt.AlignVCenter
                    fillMode: Image.PreserveAspectFit
                    source: "qrc:/assets/aboutpage/icon_b_product_name.png"
                }

                Column {
                    spacing: 15
                    Layout.fillWidth: true
                    Layout.alignment: Qt.AlignVCenter

                    Text {
                        text: "产品名称"
                        font.pixelSize: 36
                        font.bold: true
                        color: "#333333"
                    }

                    Text {
                        text: "一次性磁力搅拌系统"
                        color: "#42BCE4"
                        font.pixelSize: 28
                    }
                }
            }
        }

        GridLayout {
            columns: 2
            columnSpacing: 40
            rowSpacing: 24
            Layout.alignment: Qt.AlignHCenter
            Layout.fillWidth: true
            Layout.maximumWidth: 1580

            Card {
                padding: 30
                cardColor: "#FFFFFF"
                shadowEnabled: false
                Layout.preferredWidth: 770
                Layout.preferredHeight: rootAbout.cardWidth
                Layout.alignment: Qt.AlignHCenter

                Row {
                    Layout.fillWidth: true
                    spacing: 20
                    Layout.alignment: Qt.AlignVCenter

                    Image {
                        width: 70
                        height: 70
                        fillMode: Image.PreserveAspectFit
                        source: "qrc:/assets/aboutpage/icon_b_product_model.png"
                    }

                    Column {
                        spacing: 10
                        Layout.fillWidth: true
                        Layout.alignment: Qt.AlignVCenter

                        Text {
                            text: "产品型号"
                            font.pixelSize: 28
                            font.bold: true
                            color: "#333333"
                        }

                        Text {
                            text: systemInfo.machineType
                            color: "#42BCE4"
                            font.pixelSize: 24
                        }
                    }
                }
            }

            Card {
                padding: 30
                cardColor: "#FFFFFF"
                shadowEnabled: false
                Layout.preferredWidth: 770
                Layout.preferredHeight: rootAbout.cardWidth
                Layout.alignment: Qt.AlignHCenter

                Row {
                    Layout.fillWidth: true
                    spacing: 20
                    Layout.alignment: Qt.AlignVCenter

                    Image {
                        width: 70
                        height: 70
                        fillMode: Image.PreserveAspectFit
                        source: "qrc:/assets/aboutpage/icon_b_serial_number.png"
                    }

                    Column {
                        spacing: 10
                        Layout.fillWidth: true
                        Layout.alignment: Qt.AlignVCenter

                        Text {
                            text: "序列号"
                            font.pixelSize: 28
                            font.bold: true
                            color: "#333333"
                        }

                        Text {
                            id: serialNumberText
                            text: systemInfo.getSerialNumber()
                            color: "#42BCE4"
                            font.pixelSize: 24
                        }
                    }
                }
            }

            Card {
                padding: 30
                cardColor: "#FFFFFF"
                shadowEnabled: false
                Layout.preferredWidth: 770
                Layout.preferredHeight: rootAbout.cardWidth
                Layout.alignment: Qt.AlignHCenter

                Row {
                    Layout.fillWidth: true
                    spacing: 20
                    Layout.alignment: Qt.AlignVCenter

                    Image {
                        width: 70
                        height: 70
                        fillMode: Image.PreserveAspectFit
                        source: "qrc:/assets/aboutpage/icon_b_software_version.png"
                    }

                    Column {
                        spacing: 10
                        Layout.fillWidth: true
                        Layout.alignment: Qt.AlignVCenter

                        Text {
                            text: "软件版本"
                            font.pixelSize: 28
                            font.bold: true
                            color: "#333333"
                        }

                        Text {
                            text: systemInfo.softwareVersion
                            color: "#42BCE4"
                            font.pixelSize: 24
                        }
                    }
                }
            }

            Card {
                padding: 30
                cardColor: "#FFFFFF"
                shadowEnabled: false
                Layout.preferredWidth: 770
                Layout.preferredHeight: rootAbout.cardWidth
                Layout.alignment: Qt.AlignHCenter

                Row {
                    Layout.fillWidth: true
                    spacing: 20
                    Layout.alignment: Qt.AlignVCenter

                    Image {
                        width: 70
                        height: 70
                        fillMode: Image.PreserveAspectFit
                        source: "qrc:/assets/aboutpage/icon_b_hardware_version.png"
                    }

                    Column {
                        spacing: 10
                        Layout.fillWidth: true
                        Layout.alignment: Qt.AlignVCenter

                        Text {
                            text: "硬件版本"
                            font.pixelSize: 28
                            font.bold: true
                            color: "#333333"
                        }

                        Text {
                            text: systemInfo.hardwareVersion || "V1.0"
                            color: "#42BCE4"
                            font.pixelSize: 24
                        }
                    }
                }
            }

            Card {
                padding: 30
                cardColor: "#FFFFFF"
                shadowEnabled: false
                Layout.preferredWidth: 770
                Layout.preferredHeight: rootAbout.cardWidth
                Layout.alignment: Qt.AlignHCenter

                Row {
                    Layout.fillWidth: true
                    spacing: 20
                    Layout.alignment: Qt.AlignVCenter

                    Image {
                        width: 70
                        height: 70
                        fillMode: Image.PreserveAspectFit
                        source: "qrc:/assets/aboutpage/icon_b_capacity.png"
                    }

                    Column {
                        spacing: 10
                        Layout.fillWidth: true
                        Layout.alignment: Qt.AlignVCenter

                        Text {
                            text: "容量"
                            font.pixelSize: 28
                            font.bold: true
                            color: "#333333"
                        }

                        Rectangle {
                            height: 16
                            radius: 8
                            color: "#e0e0e0"
                            width: 450
                            Rectangle {
                                anchors.left: parent.left
                                anchors.top: parent.top
                                anchors.bottom: parent.bottom
                                width: Math.max(1, (systemInfo.usedDisk / systemInfo.totalDisk) * 450) || 370
                                color: "#3FCCE7"
                                radius: 8
                            }
                        }

                        Text {
                            text: systemInfo.diskUsage
                            color: "#42BCE4"
                            font.pixelSize: 24

                        }
                    }
                }
            }

            Card {
                padding: 30
                cardColor: "#FFFFFF"
                shadowEnabled: false
                Layout.preferredWidth: 770
                Layout.preferredHeight: rootAbout.cardWidth
                Layout.alignment: Qt.AlignHCenter

                Row {
                    Layout.fillWidth: true
                    spacing: 20
                    Layout.alignment: Qt.AlignVCenter

                    Image {
                        width: 70
                        height: 70
                        fillMode: Image.PreserveAspectFit
                        source: "qrc:/assets/aboutpage/icon_b_ip_address.png"
                    }

                    Column {
                        spacing: 10
                        Layout.fillWidth: true
                        Layout.alignment: Qt.AlignVCenter

                        Text {
                            text: "IP地址"
                            font.pixelSize: 28
                            font.bold: true
                            color: "#333333"
                        }

                        Text {
                            text: systemInfo.networkInfo
                            color: "#42BCE4"
                            font.pixelSize: 24
                        }
                    }
                }
            }
        }

        Card {
            padding: 30
            cardColor: "#FFFFFF"
            shadowEnabled: false
            Layout.preferredWidth: 1580
            Layout.preferredHeight: rootAbout.cardWidth
            Layout.alignment: Qt.AlignHCenter

            RowLayout {
                Layout.fillWidth: true
                Layout.alignment: Qt.AlignVCenter
                spacing: 15

                Image {
                    width: 64
                    height: 64
                    fillMode: Image.PreserveAspectFit
                    source: "qrc:/assets/aboutpage/icon_b_device_identifier.png"
                    Layout.alignment: Qt.AlignVCenter
                    Layout.preferredWidth: 70
                    Layout.preferredHeight: 70
                }

                Column {
                    Layout.fillWidth: true
                    spacing: 10
                    Text {
                        text: "本机识别码"
                        font.pixelSize: 36
                        font.bold: true
                        color: "#333333"
                        wrapMode: Text.Wrap
                    }
                    Text {
                        text: systemInfo.machineId
                        font.pixelSize: 24
                        color: "#42BCE4"
                        wrapMode: Text.Wrap
                    }
                }

                Item { Layout.fillWidth: true }

                Rectangle {
                    width: 54
                    height: 54
                    radius: 27
                    color: "#e0e0e0"
                    Layout.alignment: Qt.AlignVCenter
                    z: 10
                    Text {
                        text: "\uf105"
                        font.family: iconFont.name
                        font.pixelSize: 36
                        color: "#666"
                        anchors.centerIn: parent
                    }
                    MouseArea {
                        anchors.fill: parent
                        onClicked: {
                            console.log("当前屏幕信息:")
                            console.log("屏幕名称: " + screen.name)
                            console.log("屏幕分辨率: " + screen.width + "x" + screen.height)
                            console.log("屏幕逻辑分辨率: " + screen.logicalWidth + "x" + screen.logicalHeight)
                            console.log("屏幕DPI: " + screen.pixelDensity)
                            console.log("屏幕方向: " + (screen.primaryOrientation === Qt.LandscapeOrientation ? "横屏" : "竖屏"))
                            serialPage.item.visible=true;
                            /*maskRect = modelMask.createObject(root, {
                                                                      x: 0,
                                                                      y: 0,
                                                                      width: root.width,
                                                                      height: root.height,
                                                                      z:4
                                                                  })
                            serialNumber.text = systemInfo.getSerialNumber()
                            machineRect.parent = maskRect;

                            machineRect.x= 560;
                            machineRect.y=275;
                            machineRect.z=5;
                            machineRect.visible = true*/;
                        }
                    }
                }
            }
        }
    }
}
